import React, { Component } from 'react';
import { Route, NavLink } from "react-router-dom";
import UsersList from './UserList';
import UsersAdd from './UserAdd';
import UserDetail from './UserDetail';

class User extends Component {
    render() {
        let activeStyle={color:'red'}
        return (
            <div className='row'>
                <div className="col-sm-3">
                    <nav>
                        <ul className="nav nav-stacked">
                            <li><NavLink activeStyle={activeStyle} to="/user/list">用户列表</NavLink></li>
                            <li><NavLink activeStyle={activeStyle} to="/user/add">添加用户</NavLink></li>
                        </ul>
                    </nav>
                </div>
                <div className="col-sm-9">
                    <Route path="/user/list" component={UsersList}></Route>
                    <Route path="/user/add" component={UsersAdd}></Route>
                    <Route path="/user/detail/:id" component={UserDetail}></Route>
                </div>
            </div>
        );
    }
}

export default User;